<template>
  <div class="hello">
    <input type="text" v-model="Title">
     <button @click="changetitle">修改标题</button>
      <button @click="setUserInfo">修改用户信息</button>
  </div>
</template>

<script>
import { mapState,mapGetters,mapMutations } from 'vuex'
export default {
  
  name: 'HelloWorld',
  props: {
  },
   data () {
    return {
   Title:'',
    }
  },
  computed: {
    ...mapState(['num']),
    ...mapGetters('user',['bigname'])
  },
  methods: {
      ...mapMutations('user',['setUserInfo','changename']),
      changetitle(){
       this.$store.commit('changeTitle',this.Title)
       this.Title=''
     },
     setUserInfo(){
      this.$store.commit('user/setUserInfo',{name:'李四',age:20})
      this.changename(this.Title)
     }
  },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">

</style>
